核心网页指标

核心网页指标（Core Web Vitals，简称 CWV）是谷歌用来量化真实用户浏览网页时体验好坏的一套标准，主要衡量加载速度、交互响应和视觉稳定性三个维度，并已直接纳入谷歌搜索排名算法。

生活化类比

把打开一个独立站页面想象成去餐厅吃饭：

- LCP（最大内容绘制）：你坐下后，第一道菜多久端上来。等太久，你早就走了。

- INP（交互到下次绘制）：你招手叫服务员，他多久才回应你。每次点菜都慢半拍，体验极差。

- CLS（累积布局偏移）：你正要夹菜，桌子突然被挪了一下，菜洒了。页面元素乱跳就是这种感觉。

这三个指标共同决定用户是"吃得舒服"还是"摔门而去"。

核心网页指标由三个具体指标构成：

LCP 关注视口内最大的内容块（通常是首屏主图、大标题或视频封面）何时完成渲染。它取代了旧的 FCP（首次内容绘制），更能反映"用户觉得页面加载好了"的时刻。

INP 于 2024 年 3 月正式取代 FID（首次输入延迟）。FID 只测第一次交互的延迟，而 INP 测量整个页面生命周期内所有交互的响应延迟，取最差的一次（近似值），更能反映真实体验。

CLS 的计算公式为：布局偏移分数 = 影响区域 × 距离分数。每次元素意外移动都会累加，用户主动触发的移动（如点击展开）不计入。

谷歌通过 Chrome 用户体验报告（CrUX） 收集真实用户的第 75 百分位数据，三项全部达标才算"通过核心网页指标"。

术语	层级	数据来源	与 CWV 的关系
Core Web Vitals	顶层体验标准	真实用户（CrUX）	本体，含 LCP/INP/CLS
Lighthouse 分数	实验室指标	模拟环境	预测 CWV，但不等于真实数据
PageSpeed Insights	工具	实验室 + 真实数据	同时展示两者
FID	旧交互指标	真实用户	已被 INP 取代
TTFB	服务器指标	真实/实验室	影响 LCP 的关键前置因素
TBT	实验室指标	模拟环境	用于预测 INP

关键区别：Lighthouse 是实验室数据，跑分高不代表真实用户 CWV 好；CrUX 是现场数据，才是谷歌排名实际参考的依据。

案例一：某家居独立站优化 LCP

该站首屏使用 3MB 未压缩 Hero 图，LCP 达 5.2s，移动端跳出率 68%。改用 WebP 格式 + 图片 CDN + fetchpriority="high" 预加载后，LCP 降至 1.8s，跳出率下降至 41%，自然搜索流量 3 个月内增长 27%。

案例二：电商站修复 CLS

某服装站因广告位和字体加载导致 CLS 高达 0.32，用户频繁误点。通过为图片/广告位预设 width/height、使用 font-display: swap 并预留字体空间，CLS 降至 0.05，加购转化率提升 12%。

案例三：INP 优化

某 SaaS 落地页因主线程被大量第三方脚本阻塞，INP 达 620ms。通过延迟加载非关键 JS、拆分长任务（>50ms）后，INP 降至 180ms，表单提交率提升 19%。

行业参考数据：据谷歌统计，CWV 全部达标的页面，用户跳出率平均降低 24%；移动端 LCP 从 4s 优化到 2.5s，转化率可提升约 15%。

1. "Lighthouse 满分 = CWV 达标"：错。Lighthouse 是模拟数据，真实用户受网络、设备影响，必须看 CrUX 现场数据。

2. "只优化首页就行"：谷歌按 URL 分组评估，商品页、分类页、落地页都需单独优化。

3. "CLS 只和图片有关"：字体加载、动态广告、弹窗、懒加载内容都是常见元凶。

4. "INP 就是 FID 换个名字"：INP 测量所有交互，比 FID 严格得多，很多站 FID 达标但 INP 不达标。

5. "第三方脚本无法优化"：可通过 async/defer、Partytown、延迟加载等手段大幅降低影响。